<template>
  <div class="big">

        <van-nav-bar title="DIY_华硕商城" left-arrow  @click-left="onClickLeft">
      <template #right>
        <van-icon name="weapp-nav" size="18" color="black" />
      </template>
    </van-nav-bar>
<van-swipe :autoplay="3000">
  <van-swipe-item v-for="(v, index) in img1" :key="index">
    <img v-lazy="v" />
  </van-swipe-item>
</van-swipe>
<p v-for="(v,index) in img2" :key="index"><img :src="v" alt=""></p>
<goods></goods>



  </div>


</template>

<script>
import goods from './goods/goods.vue'
import Vue from 'vue';
import { NavBar } from 'vant';
Vue.use(NavBar);

import { Swipe, SwipeItem } from 'vant';
Vue.use(Swipe);
Vue.use(SwipeItem);
import { Lazyload } from 'vant';
Vue.use(Lazyload);
export default {
    components:{
goods
    },
    data(){
        return{
            img1:"",
            img2:"",
            arr1:""
          


      
        }
    },
    methods:{
        onClickLeft(){
            this.$router.push('/homepage').catch(err=>{})
        }
    },
    mounted(){
        this.$http({
            url:"http://localhost:3000/navigation6",
            method:"get",
        }).then(res=>{
            this.img1=res.data[0].data.swipe
            this.img2=res.data[0].data.img
            console.log(res.data[0].data.data2);
            this.arr1=res.data[0].data.data1
           

              
            });
          
               

            // res.data[0].data.swipe.forEach(element => {
                // swipe
                // this.img.push(element)
            // });
    }
}

</script>

<style scoped>
.big{
    background-color: black !important;
}
/deep/ .van-nav-bar .van-icon{
    color: black !important;
}
/deep/.van-nav-bar__title{
    font-size: 12px !important;
}
/deep/.van-nav-bar__title{
    max-width: 75% !important;
}



.my-swipe .van-swipe-item {
    color: #fff;
    font-size: 20px;
    line-height: 150px;
    text-align: center;
    background-color: #39a9ed;
  }
  .van-swipe-item img{
    width: 100%;
  }
p img{
    width: 100%;
}




 
 







</style>